<template>
	<view>
		<view class="maintenance-companyHome">
			<view class="maintenance-companyHome-top ff-bg-f5" :style="tabberStyle">
				<view class="maintenance-companyHome-top-header">
					<image class="topHeader"
						src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-home-bg.png"
						mode=""></image>
				</view>
				<view
					class="maintenance-companyHome-top-tipsBox ff-align-items-one ff-color-fff ff-flex-between ff-bg-fff ff-border-radius-15 ff-margin-left-15 ff-margin-right-15">
					<view v-if="roleStatus == 0" @click="personnelManagementClick"
						class="maintenance-companyHome-top-tipsBox-left ff-font-17 ff-align-items ff-border-radius-10">
						<view>
							人员管理
							<u-badge type="error" v-if="companyProjectNumList.waitValidStaffNum > 0"
								:count="companyProjectNumList.waitValidStaffNum"></u-badge>
						</view>
						<image class="ff-margin-left-18"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-go.png"
							mode=""></image>
						<image class="tipsImg"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-personel.png"
							mode=""></image>
					</view>

					<view @click="releaseRequirementsClick" :class="{ releaseActive: roleStatus == 1 }"
						class="maintenance-companyHome-top-tipsBox-right ff-font-17 ff-align-items ff-border-radius-10">
						<view>发布需求</view>
						<image class="ff-margin-left-18"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-go.png"
							mode=""></image>
						<image class="tipsImg"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-demand.png"
							mode=""></image>
					</view>
				</view>
				<view
					class="maintenance-companyHome-top-notice ff-margin-top-10 ff-margin-left-15 ff-margin-right-15 ff-border-radius-20 ff-bg-f5">
					<f-notice />
				</view>
				<view class="maintenance-companyHome-top-tabs ff-flex ff-text-center ff-bg-f5">
					<view class="ff-font-14 ff-margin-right-70" @click="choiceClick(1)">
						<view class="choiceNum"
							:class="{ 'ff-font-18': choiceActive, 'ff-font-weight-600': choiceActive, choiceActiveTop: !choiceActive }">
							进行中</view>
						<image v-if="choiceActive"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-choice.png"
							mode=""></image>
					</view>
					<view class="ff-font-14" @click="choiceClick(2)">
						<view class="choiceNum"
							:class="{ 'ff-font-18': !choiceActive, 'ff-font-weight-600': !choiceActive, choiceActiveTop: choiceActive }">
							未开始</view>
						<image v-if="!choiceActive"
							src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/company-choice.png"
							mode=""></image>
					</view>
				</view>
			</view>
			<!-- 列表数据 -->
			<view>
				<view v-if="companyList.length > 0" class="maintenance-companyHome-content">
					<view class="maintenance-companyHome-content-box ff-margin-bottom-10 ff-border-radius-10 ff-bg-fff"
						v-for="item of companyList" :key="item.assessId" @click="companyClick(item)">
						<view class="ff-font-16 ff-color-333 ff-font-weight-600 ff-ellipsis-1 ff-line-height-1-2">
							{{ item.assessName }}
						</view>
						<view class="ff-align-items-one ff-flex-wrap">
							<!-- 评估项目状态(1.已发布 2.已响应 3.待指派 11.待评估 4.评估中 5.待提交 6.待审核 7.待签发 8.已驳回 9.已完成 10.已解约 ) -->
							<view class="ff-margin-right-10">
								<view v-if="item.assessStatus == 1" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;已发布</view>
								<view v-if="item.assessStatus == 2" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;已响应</view>
								<view v-if="item.assessStatus == 3" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;待指派</view>
								<view v-if="item.assessStatus == 11" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;待评估
								</view>
								<view v-if="item.assessStatus == 4" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;评估中</view>
								<view v-if="item.assessStatus == 5" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;待提交</view>
								<view v-if="item.assessStatus == 6" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;待审核</view>
								<view v-if="item.assessStatus == 7" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;待签发</view>
								<view v-if="item.assessStatus == 8" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;已驳回</view>
								<view v-if="item.assessStatus == 9" class="tips1 ff-font-12">评估状态&nbsp;|&nbsp;已完成</view>
								<view v-if="item.assessStatus == 10" class="tips5 ff-font-12">评估状态&nbsp;|&nbsp;已解约
								</view>
								<view v-if="item.assessStatus == 12" class="tips5 ff-font-12">评估状态&nbsp;|&nbsp;已作废
								</view>
							</view>
							<view v-if="(item.assessStatus == 1 || item.assessStatus == 2) && item.responseNum > 0"
								class="tips3 ff-font-12 ff-margin-right-10">
								已有{{ item.responseNum }}家机构响应
							</view>
							<view v-if="item.rescissionStatus == 1"
								class="tips4 ff-color-fff ff-font-12 ff-margin-right-10">解约确认中</view>
						</view>
						<view class="ff-font-13 maintenance-companyHome-content-box-time">
							更新于：{{ item.modified == null ? '/' : item.modified.substr(0, item.modified.length - 3) }}
						</view>
					</view>
					<u-divider v-if="noData" border-color="#909399" height="120" margin-bottom="30" color="#909399"
						bg-color="#f5f5f5">没有更多了</u-divider>
				</view>
				<f-noData v-else :topStyle.sync="topStyle"></f-noData>
			</view>
		</view>
		<u-toast ref="uToast" />
		<f-loading ref="loading" />
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		name: 'companyHome',
		data() {
			return {
				choiceActive: true, // tabs选择状态
				companyProjectNumList: {}, // 单位项目数量
				companyList: [], // 单位列表数据
				// 评估项目状态(1.已发布 2.已响应 3.待指派 11.待评估 4.评估中 5.待提交 6.待审核 7.待签发 8.已驳回 9.已完成 10.已解约 )
				params: {
					current: 1,
					size: 5,
					statuses: [3, 11, 4, 5, 6, 7]
				},
				topStyle: '38%', // 暂无数据的css top状态
				noData: false // 没有更多了
			};
		},
		mounted() {
			this.getCompanyProjectNumList(); // 获取单位所有项目的数量
			this.getCompanyList(); // 获取单位的列表数据
		},
		computed: {
			// 用户角色状态
			...mapState({
				roleStatus: modules => modules.infoList.roleStatus
			}),
			tabberStyle() {
				return `top:${this.customBar}px;`;
			}
		},
		methods: {
			// 选择tabs
			choiceClick(e) {
				if (e == 1) {
					this.choiceActive = true;
					this.companyList = [];
					(this.params.current = 1), (this.params.statuses = [3, 11, 4, 5, 6, 7]);
					this.getCompanyList(); // 获取的数据列表
					return;
				}
				if (e == 2) {
					this.choiceActive = false;
					this.companyList = [];
					(this.params.current = 1), (this.params.statuses = [1, 2]);
					this.getCompanyList(); // 获取的数据列表
					return;
				}
			},
			// onShow监听刷新
			showLoading() {
				this.params.current = 1;
				this.getCompanyList(); // 获取的单位项目数据列表
				this.getCompanyProjectNumList(); // 获取单位所有项目的数量
			},
			// 上拉加载
			pullLoading() {
				this.params.current++;
				this.getCompanyList(); // 获取的数据列表
			},
			// 下拉加载
			downLoading() {
				let that = this;
				that.params.current = 1;
				that.getCompanyList(); // 获取的数据列表
				that.getCompanyProjectNumList(); // 获取单位所有项目的数量
				setTimeout(() => {
					that.$refs.uToast.show({
						title: '刷新成功',
						type: 'success'
					});
					uni.stopPullDownRefresh(); // 停止刷新
				}, 100);
			},
			// 获取单位所有项目的数量 + 获取单位的列表数据
			async getCompanyProjectNumList() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				const data = await this.$http.get({
					url: '/project/user/stat'
				});
				// console.log('获取的单位项目数量列表数据------', data);
				if (data.code == 200) {
					this.companyProjectNumList = data.data;
				} else {
					this.$refs.uToast.show({
						title: data.msg,
						type: 'error'
					});
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 获取单位的列表数据
			async getCompanyList() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				const data = await this.$http.post({
					url: '/bsAssessProjectInfo/user/page',
					data: this.params
				});
				// console.log('获取的单位列表数据------', data);
				if (data.code == 200) {
					const infoList = data.data.records;
					if (infoList.length == 0 && this.params.current == 1) {
						// console.log('首次加载没数据');
						this.noData = false;
						this.companyList = [];
					} else if (infoList.length < 4 && this.params.current == 1) {
						// console.log('首次加载有数据，但少于4条');
						this.noData = true;
						this.companyList = infoList;
					} else if (infoList.length !== 0 && this.params.current == 1) {
						// console.log('首次加载有数据');
						this.noData = false;
						this.companyList = infoList;
					} else if (infoList.length !== 0 && this.params.current > 1) {
						// console.log('上拉加载更多数据');
						this.noData = false;
						this.companyList = this.companyList.concat(infoList);
					} else if (infoList.length == 0 && this.params.current > 1) {
						// console.log('上拉加载没有更多数据了');
						this.noData = true;
					}
				} else {
					this.$refs.uToast.show({
						title: data.msg,
						type: 'error'
					});
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 点击项目列表进入详情
			companyClick(item) {
				// console.log('点击进入详情-----', item);
				// 评估项目状态(1.已发布 2.已响应 3.待指派 11.待评估 4.评估中 5.待提交 6.待审核 7.待签发 8.已驳回 9.已完成 10.已解约 )
				if (item.assessStatus == 1 || item.assessStatus == 2) {
					this.$pageJump.navigateTo('/pages/assessment/company/home/components/details/projectDetails?id=' + item
						.assessId);
					return;
				} else {
					this.$pageJump.navigateTo(
						'/pages/assessment/company/home/components/details/projectMaintenanceRecord?id=' + item
						.assessId);
					return;
				}
			},
			// 点击进入人员管理页面
			personnelManagementClick() {
				this.$pageJump.navigateTo(
					'/pages/maintenance/company/home/components/personnelManagement/personelCommon');
			},
			// 点击进入发布需求页面
			releaseRequirementsClick() {
				this.$pageJump.navigateTo(
					'/pages/assessment/company/home/components/releaseRequirements/releaseRequirements');
			}
		}
	};
</script>

<style lang="scss" scoped>
	@import './components/companyHome.scss';
</style>